import React from 'react'
import { Spin } from 'antd'
import Condition from 'components/condition'
const { If, Else } = Condition;

import {messages} from "share/common";

import NullCard from "containers/dashboard/dashboard-component/null-card"
import CardTitle from "containers/dashboard/dashboard-component/card-title"
import dashboardService from "containers/dashboard/dashboard.service";
import menuRoute from "routes/menuRoute";

class AccountBook extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      load: false,
      accountCardEnabled: !this.checkFunctionProfiles('account.book.disabled'),
      waitForSubmit: {}
    }
  }

  componentWillMount() {
    this.getAccountBookData();
  }

  getAccountBookData = () => {
    const {accountCardEnabled} = this.state;
    this.setState({load: true});
    accountCardEnabled && dashboardService.getAccountBook().then(res => {
      this.setState({waitForSubmit: res.data, load: false})
    })
  };

  render() {
    const {load, accountCardEnabled, waitForSubmit} = this.state;
    const {removeModule} = this.props;
    return (
      <Spin spinning={load}>
        <CardTitle  cardKey={"7"}
                    title={messages('dashboard.key36'/*账本*/)}
                    removeModule={(key) => removeModule(key)}
                    reloadModule={this.getAccountBookData}/>
        <div className="card-content"
             style={{cursor: "pointer"}}
             onClick={() => window.open(`${window.ISIE9 ? "#" : ""}${menuRoute.getRouteItem('my-account').url}`, '_blank')}>
          <Condition>
            <If value={accountCardEnabled}>
              <Condition>
                <If value={waitForSubmit.expenseNumber > 0}>
                  <div className="amount-card">
                    <div
                      className="amount-title">{waitForSubmit.expenseNumber}<span>{messages('dashboard.key37'/*笔待报销费用*/)}</span>
                    </div>
                    <div className="amount-detail">{messages('common.total.amount')/*总金额*/}:{this.filterMoney(waitForSubmit.totalAmount)}，{messages('dashboard.key165')/*记得赶紧处理哦*/}~</div>
                  </div>
                </If>
                <Else>
                  <NullCard imgType={"accountBook"} message={messages('dashboard.key167')/*太棒啦！没有待处理的费用！*/}/>
                </Else>
              </Condition>
            </If>
            <Else>
              <NullCard imgType={"unOpened"} message={messages('dashboard.key168')/*没有开启此功能*/}/>
            </Else>
          </Condition>
        </div>
      </Spin>
    )
  }
}

AccountBook.propTypes = {
  removeModule: React.PropTypes.func.isRequired
};

AccountBook.defaultProps={
};

export default AccountBook
